<%--
  Created by IntelliJ IDEA.
  User: zhuhongyu
  Date: 2022/6/10
  Time: 21:57
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>绵阳城市学院宿舍管理系统</title>
    <link rel="icon" href="images/3.icon">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="layui/css/layui.css" tppabs="http://res.layui.com/layui/dist/css/layui.css"  media="all">
    <style>
        body {
            height: 100%;
            background: url('images/1.jpg') no-repeat;
            background-position-y: -120px;
        }
        table{
            opacity: 0.8;
            color: black;
        }
        table td{
            color: black;
        }
    </style>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<table class="layui-hide" id="test" lay-filter="test"></table>
<script type="text/html" id="switchTpl">

    <input type="checkbox" name="sex" value="{{d.id}}" lay-skin="switch" lay-text="正常|缺勤" lay-filter="stateDemo" {{ d.state =='正常'?'checked':'' }}>
</script>
<script type="text/html" id="barDemo">
<%--    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>--%>
</script>
<script src="./layui/layui.js" charset="utf-8"></script>

<script>
    layui.use(['table', 'util'], function() {
        var table = layui.table
            , util = layui.util
            , form = layui.form;
        table.render({
            elem: '#test'
            , url: 'Servlet.allStudentServlet'
            , height: 'full-10'
            , title: '用户数据表'
            ,toolbar: '#toolbarDemo'
            , cols: [[
                {type: 'checkbox', title: '全选', fixed: 'left'}
                , {field: 'id', title: '学号', width: 140}
                , {field: 'name', title: '姓名', width: 120}
                , {field: 'sex', title: '性别', width: 100}
                , {field: 'spno', title: '专业', width: 240}
                , {field: 'classn', title: '班级', width: 120}
                , {field: 'building', title: '宿舍楼', width: 120}
                , {field: 'buildingnub', title: '寝室号', width: 120}
                , {field: 'fudao', title: '辅导员', width: 140}
                , {field: 'state', title: '状态', width: 110, templet: '#switchTpl',}
            ]]
        });

        form.on('switch(stateDemo)', function (obj) {
            var a=0;
            if(obj.elem.checked){
                a=1;
            }
            $.ajax({
                type: "post",
                url: "editStudent?id=" + this.value + "&state="+a
            })
            console.log(obj);
        });

        table.on('tool(test)', function (obj) {
            var data = obj.data;
            if (obj.event === 'del') {
                layer.confirm('真的删除行么', function (index) {
                    $.ajax({
                        type: "post",
                        url: "deleteStudent?id=" + data.id,
                        dataType: "json"
                    });
                    obj.del();
                    layer.close(index);
                });
            }
        });
        table.on('edit(test)', function (obj) {
            var value = obj.value
                , data = obj.data
                , field = obj.field;
            $.ajax({
                type: "post",
                url: "editStudent?id=" + data.id + "&state=" + data.state,
            })
        });
    });
</script>
</body>
</html>